<template>
	<view>
		<!--<u-sticky>
			<view class="search-bar">
				<view class="search-bar-content">
					<view class="search-item" @click="selectWorkshopPopupOptionState = true">
						<view class="search-item-label">车间</view>
						<view class="search-item-val">
							<view class="item-gap">{{ searchParams.workshopName ? searchParams.workshopName : '暂无车间' }}
							</view>
							<u-icon name="arrow-down" size="20" />
						</view>
					</view>
					<view class="search-item" @click="selectProcessPopupOptionState = true">
						<view class="search-item-label">工序</view>
						<view class="search-item-val">
							<view class="item-gap">{{ searchParams.processName || '暂无工序' }}</view>
							<u-icon name="arrow-down" size="20" />
						</view>
					</view>
				</view>
			</view>
		</u-sticky>-->
        <u-sticky>
            <view style="height: 48px;display: flex;justify-content: flex-end;align-items: center;padding: 0 16px;background: #fff;">
                <u-icon name="scan" size="38" @click="onScanBtn">扫码</u-icon>
            </view>
        </u-sticky>
		<view class="bg grid-container">
            <view class="grid-content">
                <view
                    v-for="(categoryItem, categoryIndex) in menuList"
                    :key="categoryIndex"
                >
                    <view class="grid-content-title">
                        <view class="grid-content-title-border"></view>
                        <view class="">{{ categoryItem.name }}</view>
                    </view>
                    <u-row gutter="10">
                        <view style="display: flex; flex-wrap: wrap; width: 100%;margin-top: 20rpx;">
                            <u-col
                                v-for="(item, index) in categoryItem.list"
                                :key="index"
                                :span="6"
                            >
                                <view class="grid-item" @click="onJump(item)">
                                    <view class="grid-item-icon-box" :style="{background: item.bgColor}">
                                        <u-icon :name="item.icon" size="36" color="#fff" />
                                    </view>
                                    <view class="grid-item-label">{{item.name}}</view>
                                    <view v-if="item.count" class="count-bar">{{ item.count > 99 ? '99+' : item.count }}
                                    </view>
                                </view>
                            </u-col>
                        </view>
                    </u-row>
                </view>
            </view>
		</view>
        <jkPopupOption
            :show="selectWorkshopPopupOptionState"
            :optionList="workshopList"
            @visible-change="(e) => selectWorkshopPopupOptionState = e"
            @confirm="onConfirmOfSelectWorkshop"
        ></jkPopupOption>
        <jkPopupOption
            :show="selectProcessPopupOptionState"
            :optionList="processList"
            @visible-change="(e) => selectProcessPopupOptionState = e"
            @confirm="onConfirmOfSelectProcess"
        ></jkPopupOption>
	</view>
</template>
<script>
import {
    machineManagerRepairOrderGetStateCount,
    repairOrderList,
} from "../../../../api";
	import {
		showLoading
	} from "../../../../utils/jk-utils";
    import jkPopupOption from "../../../../jk-components/jk-popup-option";
import permission from "../../../../utils/permission";

	export default {
        mixins: [permission],
        components: {
            jkPopupOption
        },
		data() {
			return {
				apiConfig: {
					list: repairOrderList
				},
                selectProcessPopupOptionState: false,
                selectWorkshopPopupOptionState: false,
                categoryList: [
                    {
                        name: '维修',
                        list: [
                            {
                                name: '故障呼叫',
                                path: '/pages/upkeepAndRepair/repair/faultCall/index',
                                state: null,
                                icon: 'server-man',
                                bgColor: 'rgb(129, 65, 217)',
                                count: 0,
                                pcRouterPath: ['faultCall']
                            },
                            {
                                name: '待接单',
                                path: '/pages/upkeepAndRepair/repair/receivingOrders/index',
                                state: 0,
                                icon: 'order',
                                bgColor: 'rgb(232, 148, 48)',
                                count: 0,
                                pcRouterPath: ['repairOrder']
                            },
                            {
                                name: '维修中',
                                path: '/pages/upkeepAndRepair/repair/receivingOrders/index',
                                state: 1,
                                icon: 'clock',
                                bgColor: '#2d8cf0',
                                count: 0,
                                pcRouterPath: ['repairOrder']
                            },
                            /*{
                                name: '我的任务',
                                path: '/pages/upkeepAndRepair/repair/receivingOrders/index',
                                state: [0, 1],
                                icon: 'clock',
                                bgColor: '#ed4014',
                                count: 0,
                                pcRouterPath: ['ltMachineList']
                            },*/
                            {
                                name: '已完成',
                                path: '/pages/upkeepAndRepair/repair/receivingOrders/index',
                                state: 2,
                                icon: 'checkbox-mark',
                                bgColor: 'rgb(21, 166, 87)',
                                count: 0,
                                pcRouterPath: ['repairOrder']
                            },
                        ],
                    },
                    {
                        name: '保养',
                        list: [
                            {
                                name: '设备保养计划',
                                path1: '/pages/upkeepAndRepair/repair/faultCall/index',
                                state: null,
                                icon: 'calendar-fill',
                                bgColor: 'rgb(129, 65, 217)',
                                count: 0,
                                pcRouterPath: ['upkeepPlanOrder']
                            },
                            {
                                name: '保养任务',
                                path1: '/pages/upkeepAndRepair/repair/faultCall/index',
                                state: null,
                                icon: 'pushpin',
                                bgColor: 'rgb(21, 166, 87)',
                                count: 0,
                                pcRouterPath: ['upkeepTask']
                            },
                            {
                                name: '我的任务',
                                path1: '/pages/upkeepAndRepair/repair/faultCall/index',
                                state: null,
                                icon: 'bookmark',
                                bgColor: 'rgb(232, 148, 48)',
                                count: 0,
                                pcRouterPath: ['upkeepTask']
                            },
                            {
                                name: '保养日程',
                                path1: '/pages/upkeepAndRepair/repair/faultCall/index',
                                state: null,
                                icon: 'calendar',
                                bgColor: '#2d8cf0',
                                count: 0,
                                pcRouterPath: ['upkeepSchedule']
                            },
                        ],
                    }
                ],
				showWorkshop: false,
				searchParams: {
					workshopId: null,
					workshopName: null,
                    processId: null,
                    processName: null,
				},
				workshopList: [],
                processList: []
			};
		},
		onShow() {
            if (!this.searchParams.workshopId) {
                this.$set(this.searchParams, 'workshopId', getApp().globalData.defaultWorkshop.id);
                this.$set(this.searchParams, 'workshopName', getApp().globalData.defaultWorkshop.name);
            }
            this.workshopList = getApp().globalData.defaultWorkshop.list;
            this.processList = getApp().globalData.defaultProcess.list;
            this.getStateCountRequest();
            this.getMyTaskCountOfRepairRequest();
            this.menuList = this.getMenuListPermission(this.categoryList);
        },
		methods: {
            onScanBtn() {
                // 允许从相机和相册扫码
                uni.scanCode({
                    success: function (res) {
                        let jsonData = {};
                        try {
                            jsonData = JSON.parse(res.result);
                        } catch {
                            wx.showToast({
                                title: '无效的二维码',
                                icon: 'error'
                            })
                        }
                        if (jsonData.machineCode) {
                            wx.showModal({
                                title: '扫码结果',
                                content: `识别到设备:${jsonData.machineCode},确定报修吗?`,
                                success(res) {
                                    if (res.confirm) {
                                        uni.navigateTo({
                                            url: `/pages/upkeepAndRepair/repair/faultCall/toCall?machineCode=${ jsonData.machineCode }`
                                        })
                                    }
                                }
                            })
                        } else {
                            wx.showToast({
                                title: '二维码格式不符',
                                icon: 'error'
                            })
                        }
                    }
                });

            },
	        // 获取我的任务条数(维修)
            getMyTaskCountOfRepairRequest() {
                return machineManagerRepairOrderGetStateCount({
                    actualRepairmanId: getApp().globalData.defaultEmp.id
                }).then(res => {
                    if (res.data.status === 200) {
                        let arr = res.data.res || [];
                        let states = [0, 1];
                        let val = 0;
                        /*this.categoryList.forEach(k => {
                            if (k.name === '维修') {
                                k.list.forEach(x => {
                                    if (x.name === '我的任务') {
                                        arr.forEach(x => {
                                            if (states.includes(x.auditState)) {
                                                val += x.count || 0;
                                            }
                                        })
                                        x.count = val;
                                    }
                                })
                            }
                        });*/
                    }
                })
            },
	        getStateCountRequest() {
	            return machineManagerRepairOrderGetStateCount().then(res => {
	                if (res.data.status === 200) {
	                    let arr = res.data.res || [];
                        /*this.categoryList.forEach(k => {
                            if (k.name === '维修') {
                                k.list.forEach(x => {
                                    if (x.name === '我的任务') {
                                        x.count = arr.find(k => k.auditState === x.state) ? arr.find(k => k.auditState === x.state).count : 0;
                                    }
                                })
                            }
                        });*/
                    }
                })
            },
            onConfirmOfSelectProcess(e, item) {
                this.$set(this.searchParams, 'processId', item.id);
                this.$set(this.searchParams, 'processCode', item.code);
                this.$set(this.searchParams, 'processName', item.name);
                this.selectProcessPopupOptionState = false;
            },
            onConfirmOfSelectWorkshop(e, item) {
                this.$set(this.searchParams, 'workshopId', item.id);
                this.$set(this.searchParams, 'workshopCode', item.code);
                this.$set(this.searchParams, 'workshopName', item.name);
                this.selectWorkshopPopupOptionState = false;
            },
			onJump(item) {
                if (item.path) {
                    wx.navigateTo({
                        url: item.path + `?state=${item.state}`
                    });
                } else {
                    wx.showToast({
                        title: '敬请期待',
                        icon: 'error'
                    })
                }
			},
			async getDependentData() {
				showLoading(true);
				showLoading(false);
			},
			onSelectWorkshop() {
				let _this = this;
				uni.showActionSheet({
					itemList: _this.workshopList.map(x => x.workshopName),
					success(res) {
						_this.$set(_this.searchParams, 'workshopId', _this.workshopList[res.tapIndex].workshopId);
						_this.$set(_this.searchParams, 'workshopName', _this.workshopList[res.tapIndex].workshopName);
						_this.getDependentData();
					}
				});
			}
		}
	}
</script>
<style scoped lang="scss">
	.search-bar {
		height: 32px;
		background: #5c6be3;
		display: flex;
		justify-content: center;
		align-items: center;

		.search-bar-content {
			width: 80%;
			background: #fff;
			margin-bottom: -60rpx;
			border-radius: 14rpx;
			z-index: 100;
			display: flex;
			justify-content: center;
			align-items: center;

			.search-item {
				width: 100%;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				padding: 14rpx 0;

				.search-item-val {
					display: flex;
					align-items: center;
					color: #515a6e;
					font-size: 28rpx;
				}

				.search-item-label {
					color: #c5c8ce;
					font-size: 26rpx;
					margin-bottom: 8rpx;
				}
			}

		}

	}

    @import "../../../production/grid/grid";
</style>
